<template>
	<div class="box">
		<div id="editorElem" class="editor-elem" style="text-align:left;"></div>
	</div>
</template>

<script>
import E from 'wangeditor';
export default {
	name: 'DetailMsgRich',
	props: {
		value: {
			type: String,
			default: () => {
				return '';
			}
		}
	},
	data() {
		return {
			editor: null,
			btnLock: false
		};
	},
	mounted() {
		this.editor = new E('#editorElem');

		this.editor.config.onchange = html => {
			// let text = this.editor.txt.text();
			this.$emit('input', html);
			// console.log(text);
			// console.log(html);
		};
		const upload = this.$service.common.upload();
		this.editor.config.onchangeTimeout = 200;
		this.editor.config.uploadImgHeaders = {
			Authorization: this.$store.state.user.token
		};
		this.editor.config.uploadFileName = 'file'; //上传参数 自定义
		this.editor.config.uploadImgServer = upload.url; // 上传图片
		// 监听
		this.editor.config.uploadImgHooks = {
			customInsert: function(insertImg, result) {
				insertImg(result.data);
			}
		};
		this.editor.create();

		this.editor.txt.html(this.value);
	}
};
</script>

<style scoped></style>
